<template>
    <div class="userInfo">
        <el-table
            border
            class="table"
            :fit="true"
            :data="tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
        >
            <el-table-column
                sortable
                label="序号"
                prop="_id"
            >
            </el-table-column>
            <el-table-column
                sortable
                label="账号"
                prop="usr"
            >
            </el-table-column>
            <el-table-column
                sortable
                label="密码"
                prop="pwd"
            >
            </el-table-column>

            <el-table-column
                    header-align="center"
                    align="center"
                    width="200"
                    label="操作"
            >
                <template slot-scope="{ row, $index }">
                    <el-button type="danger" @click="del(row)">
                        <i class="el-icon-delete"></i>删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <pageNation
            :total="tableData.length"
            :page-size="pageSize"
            @pageChange="pageChange"
            :page_index="currentPage"
        />
    </div>
</template>
<script>
    import pageNation from "../../components/pageNation"
    export default {
        name: "UserInfo",
        components:{pageNation},
        data() {
            return {
                currentPage: 1,
                pageSize: 10,
                loading: false,
                //控制修改显示隐藏
                tableData: [],
            };
        },
        mounted() {
            this.getUser();
        },
        methods: {
            //分页
            pageChange(item) {
                this.currentPage = item.page_index;
                this.pageSize = item.page_limit;
            },
            getUser(){
                this.$http.get("/api/findAll").then(res=>{
                    if(res.data.code===200){
                        this.tableData=res.data.result
                    }else{
                        this.$message({
                            type:"error",
                            message:"没有对应的数据"
                        })
                    }
                })
            },
            //点击删除
            del(row) {
                this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$http.post("/api/delUser",{
                        _id:row._id
                    }).then(res=>{
                        if(res.data.status===200){
                            this.$message({
                                type:"success",
                                message:res.data.msg
                            });
                            this.getUser();
                        }else{
                            this.$message({
                                type:"error",
                                message:res.data.msg
                            })
                        }
                    })
                }).catch((err) => {
                    console.log(err)
                });
            },
        },
    };
</script>
<style scoped>
</style>
